<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="utf-8"/>
    <title>慧尔家</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!--拨打电话功能-->
    <meta name="format-detection" content="telephone=yes"/>
    <script type="text/javascript" src="/pages/js/jquery.min.js"></script>
    <script type="text/javascript" src="/pages/js/amazeui.min.js"></script>
    <link rel="stylesheet" href="/pages/css/amazeui.min.css" type="text/css"/>
    <link rel="stylesheet" href="/pages/css/style.css" type="text/css"/>
    <style type="text/css">

        select {
            /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
            border: none;

            /*很关键：将默认的select选择框样式清除*/
            appearance: none;
            -moz-appearance: none;
            -webkit-appearance: none;

            /*在选择框的最右侧中间显示小箭头图片*/
            background: url("/pages/images/xiala.png") no-repeat scroll right center transparent;
            /*为下拉小箭头留出一点位置，避免被文字覆盖*/
            padding-right: 14px;
            width: 100%;
        }

        /*清除ie的默认选择框样式清除，隐藏下拉箭头*/
        select::-ms-expand {
            display: none;
        }
    </style>
</head>
<body>
<div class="banner"><img src="/pages/images/banner.png"/></div>
<header data-am-widget="header" class="am-header am-header-default jz">
    <div align="center">
        <select id="selectCommunity" onchange="func()">
            <option th:each="list:${session.fcCommunityList}"
                    th:value="${list.id}"
                    th:selected="${list.id} eq ${session.communityId}"
                    th:text="${list.name}">
                小区名字
            </option>
        </select>
    </div>
</header>
<ul class="menu">
    <li>
        <div class="am-gallery-item">
            <a href="/user/modifyface.html" class="">
                <img src="/pages/images/icon6.png">
                <p>门禁注册</p>
            </a>
        </div>
    </li>
    <li>
        <div class="am-gallery-item">
            <a href="/user/news.html" class="">
                <img src="/pages/images/icon1.png">
                <p>通知公告</p>
            </a>
        </div>
    </li>
    <li>
        <div class="am-gallery-item">
            <a href="#" class="">
                <img src="/pages/images/icon9.png">
                <p>家政清洁</p>
            </a>
        </div>
    </li>
    <li>
        <div class="am-gallery-item">
            <!--<a href="tel:+86-23-68639816" class="">-->
                <a href="" class="">
                <img src="/pages/images/icon4.png">
                <p>联系物业</p>
            </a>
        </div>
    </li>

</ul>

<div style="height: 49px;"></div>
<div data-am-widget="navbar" class="am-navbar  gm-foot am-no-layout" id="">
    <ul class="am-navbar-nav am-cf am-avg-sm-4">
        <li class="curr">
            <a href="/user/index.html" class="curr">
                <span class="am-icon-home"></span>
                <span class="am-navbar-label">首页</span>
            </a>
        </li>
        <li>
            <a href="/user/alarmrecord.html" class="">
                <span class="am-icon-th-large"></span>
                <span class="am-navbar-label">记录</span>
            </a>
        </li>
        <li>
            <a href="/user/member.html" class="">
                <span class="am-icon-user"></span>
                <span class="am-navbar-label">我的</span>
            </a>
        </li>

    </ul>
</div>
<script type="text/javascript">
    //获取下拉框选中事件
    function func(){
     //获取被选中的option标签
        var e = $('#selectCommunity  option:selected').val();
        console.log('选中的社区value:'+e);
        //alert(e);
        if(!e){
            alert('未选中任何社区!');
            return;
        }
        $.post("/userDo/switchCommunity.do", { "communityId": e },function(data){
            if(data.code==200){
                console.log("切换成功!");
                //alert("切换成功!");
            }else {

                alert(data.msg);
            }
        }, "json");
    }

</script>





</body>
</html>
